<template>
  <el-carousel :interval="4000" type="card" height="400px">
    <el-carousel-item v-for="item in img" :key="item.id">
      <img :src="item.src" style="width: 100%;height: 100%" >
      <h3 text="2xl" justify="center">{{ item }}</h3>
    </el-carousel-item>
  </el-carousel>
  <div class="banner_section layout_padding">
    <div class="container">
      <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
          <div class="carousel-item active">
            <div class="row">
              <div class="col-md-6">
                <h1 class="your_text">接纳<br> 自己的矛盾，才能真正成为自己</h1>
                <p class="there_text">不要害怕寻求帮助，共担责任并一同成长，每个人都有自己的故事，每个人都值得被尊重和理解，勇敢地面对情绪，让它们指引你，生活没有楼梯，只有一级一级的脚印</p>
                <div class="read_bt"><a href="#">这是你的心灵港湾</a></div>
              </div>
              <div class="col-md-6">
                <img src="../../assets/images/img-1.png" class="imgage_1">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- banner section end -->
  <!-- about section start -->
  <div class="about_section layout_padding">
    <div class="container">
      <div class="row">
        <div class="col-md-6">
          <div class="image_1"><img src="../../assets/images/img-2.png"></div>
        </div>
        <div class="col-md-6">
          <h1 class="live_text">勇敢地面对情绪</h1>
          <p class="lorem_text">相信自己的力量，追求梦想，坚持不懈。每一步都是成长，每一次挑战都是机遇。不要害怕失败，因为成功即将到来。你的才华和努力会改变世界。相信自己，你可以做到</p>
          <div class="read_bt1"><a href="#">Read More</a></div>
        </div>
      </div>
    </div>
  </div>
  <!-- about section end -->
  <!-- services section start -->

</template>
<script>
export default {
  name: "Index",
  props: {},
  data() {
    return {
      img:[
        {id:0,src:'https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/1.png'},
        {id:1,src:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/2.png"},
        {id:2,src:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/3.png"},
        {id:4,src:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/4.png"},
        {id:5,src:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/5.png"},
        {id:6,src:"https://web-tias-fc.oss-cn-chengdu.aliyuncs.com/6.png"},

      ]
    }
  },
  methods: {

  },
  setup() {

  }
}
</script>

<style lang="less" scoped>
  @import "../../assets/css/bootstrap.min.css";
  @import "../../assets/css/style.css";
</style>
 